<script setup lang="ts">
function onClickLeft() {
    history.back()
}
import { ref } from 'vue';


const checked = ref(true);
import { useRouter } from 'vue-router';
const router= useRouter()
import { useUserStore } from '@/stores/user';
const user=useUserStore()
function logOut(){
    //清空数据
    user.changeUserState({
        token:'',
        userid:'',
        isLogin:false,
        userpsw:'',
        usertel:'',
        username:''
    })
    //退出登录 跳到登录页面
    router.push('/login')
}
</script>
<template>
    <div class="content">
        <van-nav-bar title="设置" left-text="返回" left-arrow @click-left="onClickLeft" />
        <!-- 会员 -->
        <van-cell title="会员" />
        <div class="vip">
            <div class="vipbox">
                <div class="left">
                    免费会员用户
                </div>
                <div class="right">
                    <van-button type='primary'>升级会员</van-button>
                </div>
            </div>
        </div>
        <van-cell title="账号" />
        <div class="vip">
            <div class="vipbox">
                <div class="left">
                    个人主页设置
                </div>
                <div class="right">
                    <van-button type='primary' @click="$router.push('/updateUserInfo')">管理账户</van-button>
                </div>
            </div>
        </div>
        <van-cell title="通知" />
        <div class="vip">
            <div class="vipbox">
                <div class="left">
                    消息通知设置
                </div>
                <div class="right">
                    <van-switch v-model="checked" active-color="green"/>
                </div>
            </div>
        </div>
        <van-cell title="账号安全" />
        <div class="vip">
            <div class="vipbox">
                <div class="left">
                    更改密码
                </div>
                <div class="right">
                    <van-button type='primary' @click="$router.push('/updatepsw')">修改密码</van-button>
                </div>
            </div>
        </div>
        <van-cell title="帮助与支持" />
        <van-cell title="关于我们" is-link />
        <van-cell title="条款与协议" is-link />
        <van-cell title="安全政策" is-link />
        <van-button type="primary" size="large" @click="logOut">退出登录</van-button>
    </div>
</template>
<style setup lang="scss">
.vip {
    height: 60px;

    .vipbox {
        border-bottom: 1px solid #000;
        margin-left: 5vw;
        margin-right: 5vw;
        padding-bottom: 10px;
        width: 90vw;
        display: flex;

        .left {
            width: 60vw;
            font-size: 20px;
            line-height: 44px;
        }

        .right {
            width: 30vw;

            .van-button,.van-switch {
                float: right;
            }
        }
    }
}
</style>